<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Task-104</title>
    <script src="./jquery-3.2.1.js"></script>
    <link href="./bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet">
    <script src="./bootstrap-3.3.7-dist/js/bootstrap.js"></script>
    <style type="text/css">
        .textarea{
            width: 65%; 
            min-height: 120px; 
            max-height: 300px;
            padding: 3px; /*内边距*/
            border: 1px solid #818A97; /*边框实线*/
            font-size: 14px; /*字体大小*/
            line-height: 20px; /*行高*/
            word-wrap: break-word; /*允许换行*/
        }
</style>
</head>

<body>
    <div class="container">
        <div class="row"><!--行-->
            
            <div class="col-xs-12 col-sm-10">
                <h1>统一建模语言理论测试</h1><br/>
                <div class="col-xs-12 col-sm-3">
                    <p>考试科目：统一建模语言</p>
                </div>
                <div class="col-xs-12 col-sm-3">
                    <p>时间：100分钟</p>   
                </div>
                <div class="col-xs-12 col-sm-3">
                    <p>得分：100</p>
                </div>
            </div>

            <div class="col-xs-12 col-sm-10">
                <div class="col-xs-12 col-sm-3">
                        班级：<input name="class" type="text" placeholder="WH002"><!--placeholder 占位符-->
                </div>
                <div class="col-xs-12 col-sm-3">
                        学号：<input name="studentID" type="text" placeholder="0201221047"> 
                </div>
                <div class="col-xs-12 col-sm-3">
                        姓名：<input name="name" type="text" placeholder="你猜啊">
                </div>
            </div>
        
            <div class="col-xs-12 col-sm-12 " name="填空题">
            <h3>一、填空题（每空5分，共20分）</h3>
            <ol>
                <li>UML的中文全称是：<input type="text" placeholder="统一建模语言"> </li><br/>
                <li>对象最突出的特征是：<input type="text" placeholder="封装性"> <input type="text" placeholder="继承性"> <input type="text" placeholder="多态性"> </li>
            </ol>
            </div>
        
            <div class="col-xs-12 col-sm-12 " name="单选题">
            <h3>二、选择题（每题10分，共20分）</h3>
            <ol>
                <li>UML与软件工程的关系是：
                    <dl>
                        <dt><input name="only1" type="radio">（A）UML就是软件工程</dt>
                        <dt><input name="only1" type="radio">（B）UML参与到软件工程中软件开发的几个阶段</dt>
                        <dt><input name="only1" type="radio">（C）UML与软件工程无关</dt>
                        <dt><input name="only1" type="radio">（D）UML是软件工程的一部分</dt>
                    </dl>
                </li>
                <li>Java语言支持：
                    <dl>
                        <dt><input name="only2" type="radio">（A）单继承</dt>
                        <dt><input name="only2" type="radio">（B）多继承</dt>
                        <dt><input name="only2" type="radio">（C）单继承和多继承都支持</dt>
                        <dt><input name="only2" type="radio">（D）单继承和多继承都不支持</dt>
                    </dl>
                </li>
            </ol>
            </div>
        
            <div class="col-xs-12 col-sm-12 " name="多选题">
            <h3>三、多选题（每空10分，共20分）</h3>
            <ol>
                <li>用例的粒度分为以下哪三种：
                    <dl>
                        <dt><input name="morechoice" type="checkbox">（A）概述级 </dt>
                        <dt><input name="morechoice" type="checkbox">（B）需求级</dt>
                        <dt><input name="morechoice" type="checkbox">（C）用户目标级</dt>
                        <dt><input name="morechoice" type="checkbox">（D）子功能级</dt>
                    </dl>
                </li>
                <li>类图由以下哪三部分组成：
                    <dl>
                        <dt><input name="morechoice" type="checkbox">（A）名称（Name）</dt>
                        <dt><input name="morechoice" type="checkbox">（B）属性（Attribute）</dt>
                        <dt><input name="morechoice" type="checkbox">（C）操作（Operation） </dt>
                        <dt><input name="morechoice" type="checkbox">（D）方法（Function） </dt>
                    </dl>
                </li>
            </ol>
            </div>
        
            <div class="col-xs-12 col-sm-12 " name="判断题">
            <h3>四、判断题（每题10分，共20分）</h3>
            <ol>
                <li>用例图只是用于和客户交流和沟通的，用于确定需求
                <input name="choice1" type="radio"> √
                <input name="choice1" type="radio"> ×
                </li>
                <li>在状态图中，终止状态在一个状态图中允许有多个
                    <input name="choice2" type="radio"> √
                    <input name="choice2" type="radio"> ×
                </li>
            </ol>
            </div>

            <div class="col-xs-12 col-sm-12" name="简答题">
            <h3>五、简答题（每题20分，共20分）</h3>
            <ol>
                <li>简述什么是模型以及模型的表现形式？</li>
                <div class="textarea" contenteditable="true"> 
                    <!--contenteditable 可编辑-->
                    <div>模型是对现实世界的简化和抽象，模型是对所研究的系统、过程、事物或概念的一种表达形式，可以是物理实体，可以是某种图形，或者是一种数学表达式。</div>
                </div>
            </ol>
            </div>
        </div>
        <br/>
        <button class="btn" type="submit">
        计算分数
        </button>
    </div>
    
</body>
</html>